
<div class="navbar">
  <div class="navbar-inner">
    <div class="left sliding"><a href="index.html" class="back link"><i class="icon icon-back"></i><span>Back</span></a></div>
    <div class="center sliding">Color Themes</div>
    <div class="right"><a href="#" class="open-panel link icon-only"><i class="icon icon-bars"></i></a></div>
  </div>
</div>
<div class="pages navbar-through">
  <div data-page="color-themes" class="page">
    <div class="page-content">
      <div class="content-block">
        <p>Framework7 comes with default 10 iOS color themes set and three layout color themes (default, dark and pure white):</p>
      </div>
      <div class="content-block-title">Choose Layout Theme</div>
      <div class="content-block">
        <div class="row">
          <div data-layout="" class="col-33 ks-layout-theme ks-layout-default active"></div>
          <div data-theme="dark" class="col-33 ks-layout-theme ks-layout-dark"></div>
          <div data-theme="white" class="col-33 ks-layout-theme ks-layout-white"></div>
        </div>
      </div>
      <div class="content-block-title">Choose Color Theme</div>
      <div class="content-block">
        <div class="row">
          <div data-theme="white" class="col-20 ks-color-theme bg-white"></div>
          <div data-theme="black" class="col-20 ks-color-theme bg-black"></div>
          <div data-theme="blue" class="col-20 ks-color-theme bg-blue"></div>
          <div data-theme="orange" class="col-20 ks-color-theme bg-orange"></div>
          <div data-theme="red" class="col-20 ks-color-theme bg-red"></div>
        </div>
        <div class="row">
          <div data-theme="pink" class="col-20 ks-color-theme bg-pink"></div>
          <div data-theme="green" class="col-20 ks-color-theme bg-green"></div>
          <div data-theme="lightblue" class="col-20 ks-color-theme bg-lightblue"></div>
          <div data-theme="yellow" class="col-20 ks-color-theme bg-yellow"></div>
          <div data-theme="gray" class="col-20 ks-color-theme bg-gray"></div>
        </div>
      </div>
    </div>
  </div>
</div>